<template>
	<view class="approve-list-box">
		<view class="current-state">
			<view>当前状态</view>
			<view>
				<uni-tag :inverted="true" :text="relationEntity.status==0?'未审批':(relationEntity.status==1?'审批中':'已审批')"
					:type="relationEntity.status==0?'error':(relationEntity.status==1?'success':'primary')" />
			</view>
		</view>
		<view class="approve-boxs">
			<view v-if="approveEntities.length > 0">
				<uni-steps :options="approveEntities" active-color="#007AFF" :active="active" direction="column" />
			</view>
			<o-empty v-else bg="#f3f3f3"></o-empty>
		</view>
	</view>
</template>

<script>
	import {
		api,
		post
	} from '@/util/api.js'
	import {
		format
	} from '@/util/util.js'
	export default {
		props: {
			relationId: '',
			flag: '', // 关联类型，1：合同，2：报销，3：报价；5：支付申请
		},
		data() {
			return {
				approveEntities: [],
				relationEntity: {},
				active: 0,
			}
		},
		created() {
			this.queryList()
			this.queryRelation()
		},
		methods: {
			change() {
				if (this.active < this.list1.length - 1) {
					this.active += 1
				} else {
					this.active = 0
				}
			},
			queryList() {
				let that = this
				post(api.ApproveEntities, {
					relationId: this.relationId
				}).then(res => {
					// 组装步骤条
					res.data.forEach(function(item, index) {
						let title = item.result == 0 ? '申请' : (item.result == 1 ? '同意' : '驳回')
						let step = {
							title: title,
							desc: item.approveUserName + '：' + item.info + '\n时间：' + format.dateFormat('', item.createTime)
						}
						that.approveEntities.push(step)
					})
					that.active = res.data.length - 1
				})
			},
			queryRelation() {
				// 获取下一审批人，审批结束后不在获取
				let url = this.flag == 1 ? api.ContractSingle : (this.flag == 2 ? api.ExpenseSingle : (this.flag == 3 ? api
					.QuoteSingle : api.PaySingle))
				post(url, {
					id: this.relationId
				}).then(res => {
					this.relationEntity = res.data
				})
			}
		}
	}
</script>

<style>
	@import '@/static/css/ApproveList.css';
</style>